<template>
  <div class="header_div" :class="header_bgk ? 'header_style_1' : 'header_style_0'">
    <!-- 筛选 邮件部分 -->
    <van-row>
      <!-- 筛选按钮 -->
      <van-col offset="18" span="3" class="icon_item">
        <router-link to="/search">
          <span class="iconfont icon-shaixuan"></span>
        </router-link>
      </van-col>
      <!-- 邮件按钮 -->
      <van-col span="3" class="icon_item">
        <router-link to="/email">
          <span class="iconfont icon-weibiaoti-"></span>
          <i class="red_icon"></i>
        </router-link>
      </van-col>
    </van-row>
  </div>
</template>
<script>
export default {
  name:'Header',
  props:["header_bgk"],
  data() {
    return {
    }
  },
}
</script>
<style lang="less" scoped>
  .header_div{
    position: fixed;
    top: 0;
    z-index: 99;
    width: 100%;
    height: 0.45rem;
    font-size: 0.34rem;
    transition: all 0.5s;
    .iconfont{
      font-size: 0.25rem;
    }
  }

  .icon_item{
    position: relative;
  }

  .red_icon{
    top: 0.07rem;
    right: 0.13rem;
  }


  .header_style_1{
    .iconfont{
      color: #1E1E1E !important;
    }
    background-color: rgba(255, 255, 255, 1);
    
  }
  .header_style_0{
    .iconfont{
      color:#fff !important;
    }
    background-color: rgba(255, 255, 255, 0);
  }
</style>